<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<s:include value="/WEB-INF/content/common/header.jsp" />
<title><s:text name="global.application.title" /> - <s:text
		name="global.title.input" /></title>
		
<style>

input[readonly="readonly"]{
	background-color: #ffffff;
	}

</style>

</head>
<body>
	<s:include value="/WEB-INF/content/common/title-head.jsp" />

	<div data-role="content" style="padding:0px;">
		<div class="ui-bar ui-bar-d" style="margin-top:10px; height:58px; padding:0px;" data-icon="check">
		
			<fieldset class="ui-grid-b">	
				<div class="ui-block-a center" style="width:30%; margin-top:18px;">
					<s:text name="implimentation.time" />
				</div>				
				<div class="ui-block-b" style="width:33%;">
					<input class="center" name="time" type="date" data-role="datebox" data-theme="b"
						data-options='{"mode": "timebox", "useFocus": true, "timeFormatOverride":12}'
						id="timepicker"/>
				</div>				
				<div class="ui-block-c" style="width:33%; margin-left:20px;">
					<button data-theme="b" id="btnCurrentTime"><s:text name="btn.current.time" /></button>
				</div>	
			</fieldset>
		</div>
	</div>

	<div data-role="content" >
		<div class="ui-bar ui-bar-c rounded" id="data">
			<div class="center" style="padding:10px;">
				<h5><s:text name="input.vital"/></h5>
			</div>
			<div class="wellwhite rounded vitaltable">
			
				<s:form namespace="/input" action="saveVital" id="vitalform" data-ajax="false">
					<s:hidden name="inputGroup" value="バイタル(定期)" />
					<s:hidden name="plannedTime" id="plannedTime"/>
					
					<input type="hidden" name="ansTxtInt" id="vital0" class="center vitalinputs" style="margin-top:3px;" readonly="readonly" maxlength="3" type="text" >
					<input type="hidden" name="ansTxtIntHidden" value="血圧（上）" id="save_ansTxtIntHidden"/>
					
					<input type="hidden" name="ansTxtInt" id="vital1" class="center vitalinputs" style="margin-top:3px;" readonly="readonly" maxlength="3" type="text" >
					<input type="hidden" name="ansTxtIntHidden" value="血圧（下）" id="save_ansTxtIntHidden"/>
										
					<input type="hidden" name="ansTxtInt" id="vital2" class="center vitalinputs" style="margin-top:3px;" readonly="readonly" maxlength="3" type="text" >
					<input type="hidden" name="ansTxtIntHidden" value="脈拍" id="save_ansTxtIntHidden"/>
					
					<input type="hidden" name="ansTxtDouble" id="vital3" class="center vitalinputs" style="margin-top:3px;" readonly="readonly" maxlength="3" type="text" >
					<input type="hidden" name="ansTxtDoubleHidden" value="体温" id="save_ansTxtDoubleHidden"/>
					
					<fieldset class="ui-grid-b">
						<div class="ui-block-a" style="width:15%;"></div>
						<div class="ui-block-b center" style="width:70%;">
							<div class="ui-overlay-shadow ui-corner-all pop ui-body-d" style="width: 100%;">
								<div class="ui-datebox-header ui-grid-c" style= "padding:10px;">
									<div class="ui-block-a" style="text-align: center; width: 25%;"><s:text name="input.vital.BPH"/></div>
									<div class="ui-block-b" style="text-align: center; width: 25%;"><s:text name="input.vital.BPL"/></div>
									<div class="ui-block-c" style="text-align: center; width: 25%;"><s:text name="input.vital.PR"/></div>
									<div class="ui-block-d" style="text-align: center; width: 25%;"><s:text name="input.vital.BT"/></div>
								</div>
								
								<div class="ui-datebox-flipcontent">
									<div id="vital0swap" class="ui-overlay-shadow" style="width: 20%;"></div>					
									<div id="vital1swap" class="ui-overlay-shadow" style="width: 20%;"></div>
									<div id="vital2swap" class="ui-overlay-shadow" style="width: 20%;"></div>
									<div id="vital3swap" class="ui-overlay-shadow" style="width: 20%;"></div>
								</div>
								
								<div class="ui-datebox-flipcenter ui-overlay-shadow" style="pointer-events: none; top: -43.5px; width: 95%;"></div>
							
								<div class="ui-grid-c">
									<div class="ui-block-a" align="center" style="width: 25%;">
										<a href="#" data-role="button" data-iconpos="notext" data-icon="back" data-theme="c" onclick="getDefaultValue('#vital0')">
											<s:text name="vital.reset"/>
										</a>
									</div>
									<div class="ui-block-b" align="center" style="width: 25%;">
										<a href="#" data-role="button" data-iconpos="notext" data-icon="back" data-theme="c" onclick="getDefaultValue('#vital1')">
											<s:text name="vital.reset"/>
										</a>
									</div>
									<div class="ui-block-c" align="center" style="width: 25%;">
										<a href="#" data-role="button" data-iconpos="notext" data-icon="back" data-theme="c" onclick="getDefaultValue('#vital2')">
											<s:text name="vital.reset"/>
										</a>
									</div>
									<div class="ui-block-d" align="center" style="width: 25%;">
										<a href="#" data-role="button" data-iconpos="notext" data-icon="back" data-theme="c" onclick="getDefaultValue('#vital3')">
											<s:text name="vital.reset"/>
										</a>
									</div>
								</div>
							</div>
							<div style="margin-top:25px;">
								<button id="btnComplete" type="submit">
									<s:text name="input.newvital.SaveVital" />
								</button>
							</div>
						</div>
						<div class="ui-block-c" style="width:15%;"></div>
					</fieldset>
				</s:form>	
			</div>		
		</div>
	</div>
		
	<script type="text/javascript">

		$(function() {
			swipevital("vital0", vital0min, vital0max);
			swipevital("vital1", vital1min, vital1max);
			swipevital("vital2", vital2min, vital2max);
			swipevital("vital3", vital3min*10, vital3max*10);
		});
	
	</script>
	


	<script type="text/javascript">
		$(document).ready(function() {

			function validNumber(code) {
				if (!(code == 8 || code == 46
						|| (code >= 35 && code <= 40)
						|| (code >= 48 && code <= 57) || (code >= 96 && code <= 105))) {
					return false;
				} else {
					return true;
				}
			}

			$('.INTEGER').keydown(function(e) {
				var key = (e.which) ? e.which : e.keyCode;
				if (!validNumber(key)) {
					e.preventDefault();
				}
			});

			$('.DOUBLE').keydown(function(e) {
				var key = (e.which) ? e.which: e.keyCode;
				if (!validNumber(key) && key != 190 && key != 110) {
					e.preventDefault();
				} else {
					if (($(this).val().indexOf(".")) >= 0 && (key == 190 || key == 110)) {
						e.preventDefault();
					}
				}

			});

			$('#btnCurrentTime').click( function() {
				var time = new Date();
				$('#timepicker').prop('value',	time.getHours() + ":" + time.getMinutes());
				setPlannedTime();
			});
 
			$('#timepicker').change(function () {
				setPlannedTime();
			});
			
			setPlannedTime();
			
			function setPlannedTime(){
				var plannedTime = $('#timepicker').val();
				$("input[id=plannedTime]").val(plannedTime);
			}

		});
		
	</script>
	
	<s:include value="/WEB-INF/content/common/footer.jsp" />